import { Component, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { Subscription } from 'rxjs/Subscription';
import { Observable } from 'rxjs/Observable';
import { BsModalService } from 'ngx-bootstrap/modal';
import { BsModalRef } from 'ngx-bootstrap/modal/modal-options.class';
import { AddNoteComponent } from './../add-note/add-note.component';
// import product service
import { ProductService } from './../../core/services/product.service';
import { ProductDetail } from './../../core/class/product-detail';
import { ConfirmComponent } from './../confirm/confirm.component';
import { ToasterService } from '../../share/toastr/toastr.service';

@Component({
  selector: 'app-product-detail',
  templateUrl: './product-detail.html',
  styleUrls: ['./product-detail.css']
})
export class ProductDetailComponent implements OnInit {

  noteList: any[] = [];

  public modalRef:     BsModalRef;
  actionsSubscription: Subscription;
  // product: Product[];
  product$:  ProductDetail = new ProductDetail();
  routeSubs: Subscription;
  productId: any;

  // note list paginations
  errorMessage: string;
  pageCount:    number = 5;
  total:        number;
  p:            number = 1;
  noteIndex:    number;



  constructor(
    private bsModalService: BsModalService,
    private productService: ProductService,
    private route:          ActivatedRoute,
    public  toastrService: ToasterService
  ) { }

  ngOnInit() {
    this.getProductDetails();
    this.getNotePage(1);
  }
  private parente_string: string;

  getViewChartDays(value) {
    console.log('value', value);
    this.product$.switchDays(value);

  }

   testing() {
    this.toastrService.successful('this is a testing!');
  }


  public AddNote() {
    this.modalRef = this.bsModalService.show(AddNoteComponent, {
      animated:            true,
      keyboard:            true,
      backdrop:            true,
      ignoreBackdropClick: false
    })
  }

  public confirmModal() {
    this.modalRef = this.bsModalService.show(ConfirmComponent, {
      animated:            true,
      keyboard:            true,
      backdrop:            true,
      ignoreBackdropClick: true
    });
    // this.modalRef.content.confirm.subscribe(this.deleteNotes());
  }

  getProductDetails() {
    this.actionsSubscription = this.route.params.subscribe(
    (params: any) => {
      this.productId = params['asin'];
      console.log(`current product-detail page productId ===> ${this.productId}`);
      this.productService.getProductInfo(this.productId)
          .subscribe((response) => {
            this.product$.ParseFromJason(response);
            console.log(`response product$ ===>`, this.product$);
          });
        }
      );
  }


  getNotePage(page: number) {
    const start = (page - 1) * this.pageCount;
    const end = start + this.pageCount;
    this.productService.noteListPaginate(start, end).subscribe(
      data => {
        this.noteList = data;
        this.total = 25;
        this.p = page;
        console.log(`current note list content ===> `, this.noteList);
      }, error => this.errorMessage = <any> error
    );
  }


  deleteNotes() {
    this.productService.DeleteNote(this.productId)
        .subscribe(
          success => {
              this.getNotePage(1);
              this.toastrService.successful('delete note successfuly ! ');
            },
            errors => {
              console.log('error message ...', errors);
              this.toastrService.errors('delete note failed ! ');
            }
        )
  }

  public testingDelete(id) {
    if (confirm("Are you sure?")) {
      this.productService.deletedNote(id).then(() => {
        this.getNotePage(1);
      })
    }
  }

}
